<div id="app" v-cloak>
    <el-scrollbar style="height: calc(100vh - 100px)">
        <el-form ref="form" :model="form" :rules="rules" label-width="100px">
            <el-form-item label="配置名称" prop="title">
                <mu-form v-model="form.title" input-type="text" width="360px" placeholder="请输入配置名称"></mu-form>
            </el-form-item>
            <el-form-item label="配置标识" prop="name">
                <mu-form v-model="form.name" input-type="text" width="360px" placeholder="请输入配置标识"></mu-form><br>
                <span style="color: red;margin-left: 5px">不可重复</span>
            </el-form-item>
            <el-form-item label="配置类型" prop="type">
                <mu-form v-model="form.type" input-type="select" :options="formTypeList" label-field="title" value-field="value" width="360px" placeholder="请选择配置类型"></mu-form>
            </el-form-item>
            <el-form-item label="配置值" prop="value">
                <mu-form v-model="form.value" input-type="text"   width="360px" placeholder="请输入值"></mu-form>
            </el-form-item>
            <el-form-item label="选项配置" prop="content" v-if="sxList.includes(form.type)">
                <key-value v-model="form.content"></key-value>
<!--                <mu-form v-model="form.content" input-type="textarea" width="360px" placeholder="请输入选项配置"></mu-form>-->
            </el-form-item>
        </el-form>
    </el-scrollbar>
    <div style="display: flex;margin-top: 20px;margin-left: 100px" class="flex-column">
        <div >
            <el-button type="primary" @click="onSubmitAdd">立即创建</el-button>
            <el-button @click="onCancel">取消</el-button>
        </div>
    </div>
</div>